<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户管理iFrame</title>
    <script src="static/js/jquery-3.4.1.min.js"></script>
    <script src="static/layui/layui.js"></script>
    <link rel="stylesheet" href="static/layui/css/layui.css">
</head>
<body>

<!-- 卡片搜索面板-->
<div class="layui-form">
    <div class="layui-form-item">
        <div class="layui-inline">
            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="mobile" placeholder="请输入用户手机号">
            </div>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" id="test1" placeholder="请选择发送时间">
            </div>
            <div class="layui-input-inline">
                <button class="layui-btn" id="search">查询</button>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <button class="layui-btn" id="retry">重发</button>
        </div>
    </div>
</div>
<!-- 上方工具栏-->
<script type="text/html" id="auth-insert">
    <form class="layui-form" method="post">
        <div class="layui-form-item" style="padding-right: 50px">
            <label class="layui-form-label">登录名</label>
            <div class="layui-input-block">
                <input id="post-username" type="text" name="title" required  lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="padding-right: 50px">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-block">
                <input id="post-name" type="text" name="title" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="padding-right: 50px">
            <label class="layui-form-label">密码</label>
            <div class="layui-input-block">
                <input id="post-password" type="text" name="title" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="padding-right: 50px">
            <label class="layui-form-label">管理员</label>
            <div class="layui-input-block">
                <input type="checkbox" lay-filter="insert_switch" lay-skin="switch" name="close" lay-text="是|否" checked>
            </div>
        </div>
    </form>
</script>

<table class="layui-hide" id="auth-table" lay-filter="auth-table" style="height: 100%"></table>
<script type="text/html" id="state">
    {{d.status = d.status == 2 ? "发送失败" : d.status}}
</script>
<script type="text/html" id="isAdminTpl">
    <input type="checkbox" lay-filter="insert_switch" name="close" lay-skin="switch" lay-text="是|否" checked>
</script>

<#--<script type="text/html" id="toolbar">-->
<#--    <div class="layui-btn-container">-->
<#--        <button class="layui-btn layui-btn-sm" lay-event="addPost">添加用户</button>-->
<#--    </div>-->
<#--</script>-->

<script type="text/html" id="barTpl">
    <a class="layui-btn layui-btn-xs" lay-event="edit">保存</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script>
    var layerCallback;
    layui.use('laydate', function() {
        var laydate = layui.laydate;

        //常规用法
        laydate.render({
            elem: '#test1'
        });
    });
    layui.use(['table', 'form'], function(){
        var table = layui.table;
        var form = layui.form;
        var util = layui.util;
        var tableIns = table.render({
            elem: '#auth-table',
            url:'${request.contextPath}/smsg/lists',
            toolbar: '#toolbar',
            parseData: function (res) {
                console.log(res);
                return {
                    "code": 0,
                    "msg": "",
                    data: res.data,
                    count: res.size
                }
            }
            ,cols: [[
                {type:'checkbox', fixed:'left'},
                {field:'id',         width:60,  title: 'ID'},
                {field:'sendTime',   width:160, title: '时间', edit: 'text',templet: function (d) {
                        return util.toDateString(d.sendTime, "yyyy-MM-dd HH:mm:ss")}},
                {field:'phone',      width:150, title: '手机号', edit: 'text'},
                {field:'templateId', width:150, title: '模板id', edit: 'text'},
                {field:'templateContent', width:150, title: '模板内容', edit: 'text'},
                {field:'status',     width:150, title: '状态', edit: 'text',templet: '#state'},
                {field:'msg',     width:150, title: '返回信息', edit: 'text'},
                {field:'sendTime',     width:150, title: '发送时间',templet: function (d) {
                        return util.toDateString(d.sendTime, "yyyy-MM-dd HH:mm:ss")
                    }}
                // {field:'msg', width:120, title: '短信内容', edit: 'text'},
                // {fixed: 'right', width:150, align:'center', toolbar: '#barTpl'} 暂不开放修改和删除功能
            ]],
            id: 'ids',
            page: true
        });

        var temp;
        form.on('switch(admin_switch)', function (obj) {
            temp = obj.elem.checked;
        });



        // /* 搜索实现, 使用reload, 进行重新请求 */
        // $("#search-input-phone").on('input',function () {
        //     search(table);
        // });


    });

    $("#retry").click(function(){
        var ids = [];
        var table = layui.table;
        var checkStatus = table.checkStatus('ids');
        var arr = checkStatus.data;
        var url = '${request.contextPath}/smsg/retry';
        arr.forEach(function(value,index,array){
            ids.push(value.id);
        });
        if(ids.length>0){
            $.ajax({
                url: url,
                data: {ids:ids},
                type: 'post',
                dataType: 'json',
                traditional: true,
                success: function(res){
                    console.log(res);
                    var msg = "重新发送成功"+res.succ+"条!";
                    $(".layui-laypage-btn")[0].click();
                    parent.layer.alert(msg, {icon: 1, skin: 'layui-layer-molv'});
                }
            });
        }else{
            layer.alert("请至少选中一条记录！");
        }
    });


    $("#search").click(function(){
        search();
    });

    function search() {
        var table = layui.table;
        // 用来传递到后台的查询参数MAP
        var whereData = {};
        var qphone = $("#mobile").val();
        var sendTime = $("#test1").val();

        if (qphone.length > 0) {
            whereData.phone = qphone;
        }
        if (sendTime.length > 0) {
            whereData.sendTime = new Date(sendTime);
        }
        console.log(whereData);

        table.reload("ids",{
            where:  whereData
            ,page: {
                curr: 1
            }
            ,
            done: function(res){
                this.where={};
            }
        });
    }


</script>

</body>
</html>